  var APIKey = "DxN1BjoFMCVcKrewTTKBP";
  var APIDomain = "https://ivle.nus.edu.sg/";
  var APIUrl = APIDomain + "api/lapi.svc/";
  var LoginURL = APIDomain + "api/login/?apikey=" + APIKey + "&url=http%3A%2F%2Flocalhost%2Fadaptive_system%2Findex.html";

  var userId = "";

  // for style
  var colorArrayPanel = ["primary", "green", "yellow", "red", "orange"];
  var future;


  //variable to store the Authentication Token
  var Token = "";

  //function to get the query string parameters
  var search = function () {
    var p = window.location.search.substr(1).split(/\&/), l = p.length, kv, r = {};
    while (l--) {
      kv = p[l].split(/\=/);
      r[kv[0]] = kv[1] || true; //if no =value just set it as true
    }
    return r;
  } ();
  
  //function to get the query string parameters
  var getParameterByName = function (name) {
    name = name.replace(/[\[]/, "\\[").replace(/[\]]/, "\\]");
    var regex = new RegExp("[\\?&]" + name + "=([^&#]*)"),
        results = regex.exec(location.search);
    return results === null ? "" : decodeURIComponent(results[1].replace(/\+/g, " "));
  };

  $(document).ready(function () {
    document.getElementById('page-wrapper').style.height = ($(window).height() - 100) + "px";

    $("#username").keyup(function(event){
      if(event.keyCode == 13){
          $("#sign-in-button").click();
      }
    });
    $("#password").keyup(function(event){
      if(event.keyCode == 13){
          $("#sign-in-button").click();
      }
    });

    userId = getParameterByName("userId");

    if (userId == "") {
      $('#login-page').show();
      $('#main-page').hide();
    } else {
      $('#userName').html("User");
      $('#login-page').hide();
      $('#main-page').show();
      $('#nav-home-button').attr('href','index.html?userId=' + userId);
      GetModuleList(userId);
    }


    //check query string for search token
/*    if (search.token && search.token.length > 0 && search.token != 'undefined') {
      Token = search.token;
    }

    if (Token.length < 1) {
      window.location = LoginURL;
    } else {
      //$('#lbl_Token').html(Token);
      Populate_UserName();
      Populate_Data();
    } */
//    $('#userName').html("User");
//    userId = "a0088381";
//    GetModuleList(userId);
  }); 

  var SignIn = function() {
    userId = $("#username").val();
    $('#userName').html("User");
    $('#login-page').hide();
    $('#main-page').show();
    $('#nav-home-button').attr('href','index.html?userId=' + userId);
    GetModuleList(userId);
  };

  var Populate_UserName = function() {
    var url = APIUrl + "UserName_Get?output=json&callback=?&APIKey=" + APIKey + "&Token=" + Token;

    jQuery.getJSON(url, function (data) {
      $('#userName').html(data);
    });
  };
    
  var Populate_Data = function() {
    var url = APIUrl + "UserID_Get?output=json&callback=?&APIKey=" + APIKey + "&Token=" + Token;

    jQuery.getJSON(url, function (data) {
      userId = data;
      GetModuleList(data);
    });
  };

  var GetModuleList = function(data) {
    $('#moduleList').empty();
    url = "php/get_initial_value.php?matric=" + data;
//    tbl = $("#module_table");
    jQuery.getJSON(url, function (data) {
      for (i = 0; i < data.length; i++) {
      color = colorArrayPanel[i%colorArrayPanel.length]; 
      div_data = GetModulePanel(color, data[i].module_code, data[i].module_name, data[i].topics);
      $('#moduleList').append(div_data);
      }
    });
  };

  var GetModulePanel = function(color, moduleCode, moduleName, topics) {
    div_data = "<div class=\"col-lg-3 col-md-6\"><div class=\"panel panel-" + color + "\"><div class=\"panel-heading\"><div class=\"row\"><div class=\"col-xs-3\"><i class=\"fa fa-tasks fa-5x\"></i></div><div class=\"col-xs-9 text-right\"><div class=\"huge\">" + moduleCode + "</div><div>" + moduleName + "</div></div></div></div><a><div class=\"panel-footer\"><span class=\"pull-left\"><li class=\"dropdown\"><a id=\"topicDropdown\" href=\"#\" data-toggle=\"dropdown\"></b>View topics</a>";

    if (topics.length > 0) {
      div_data += "<ul class=\"dropdown-menu\">";
      for (j = 0; j < topics.length; j++) {
        div_data += "<li><a href=\"javascript:void(0);\" onclick=\"StartTraining('" + moduleCode + "', " + topics[j].topic_id + ");\">" + topics[j].topic_name + "</a></li>";
//        div_data += "<li><a href=\"training.html?moduleCode=" + moduleCode + "&topicId=" + topics[j].topic_id + "&userId=" + userId + "&token=" + Token + "\" class=\"confirmation\">" + topics[j].topic_name + "</a></li>";
      }
      div_data += "</ul>";
    }
    div_data += "</li></span></div></a></div></div>";
    return div_data;
  }

  var StartTraining = function(moduleCode, topicId) {
    bootbox.confirm("You want to start training?", function(result){
      if(result){
        url = "training.html?moduleCode=" + moduleCode + "&topicId=" + topicId + "&userId=" + userId + "&token=" + Token;
        window.location = url;
      }
    });
  };